<template>
	<div class="index" style="background-color: white;box-sizing: border-box;padding: 20px;">
		<!-- <div class="hei10"></div> -->
		<!-- <div class="title">发展分销商</div> -->
		<div class="t_newtitle_box">
			<div class="t_red_line"></div>
			<div class="t_new_title">
				通过供应商代码添加分销商
			</div>
		</div>
		<div class="t_title_tips">
			已注册的平台用户在添加供应商中输入该代码可成为您的分销商
		</div>
		<div class="t_myid">
			<span style="color: #333333;">我的供应商代码：</span><span style="font-weight: bold;">{{msg}}</span>
			<span @click="allcopy(msg)" style="color: #0C83FF;margin-left: 30px;margin-right: 30px;cursor: pointer;">复制代码</span>
			<el-button type="primary" plain round @click="updateCode">更新代码</el-button>
		</div>
		<div class="t_red_tips">
			友情提示：为了保障您的业务安全，建议不要随意公开分销商代码并定期更换分销商代码。
		</div>
		<div class="t_newtitle_box" style="margin-top: 80px;">
			<div class="t_red_line"></div>
			<div class="t_new_title">
				通过链接邀请添加分销商
			</div>
		</div>
		<div class="t_title_tips">
			合作伙伴通过点击您分享的链接加入到平台并成为您的分销商（注册或已有账号登录均可）
		</div>
		<div class="t_invitation"><span @click="copy" style="color: #0C83FF;cursor: pointer;">复制我的推广链接</span></div>

	</div>
</template>

<script>
	import axios from 'axios'
	import top from '@/components/top.vue'
	import left from '@/components/left.vue'
	import foot from '@/components/foot.vue'
	export default {
		components: {
			"left": left,
			"top": top,
			"foot": foot
		},
		name: 'myDistributor',
		data() {
			return {
				msg: "",
				id: "",

				loading: true,
				search: "",
				log: false,
        pingbiwho:"",
        pingbiji:"",
				money: "",
				total: 0,
				pagesize: 20,
				page: 1,
				list: "",
				shop_id: "",
				danxuans: [],
				quanxuana: false,
				quanxuans: [],
				dialog: false,
				radio: '1',
				listk: "",
				real_name: "",
				jlid: "",
				func_B02: false,
				checked: false,
				selling: 0,
        is_shield_agent:"",
        num:5,
        daojishi:""
			}
		},
		beforeDestroy() {
		  document.onkeydown = null
		},
		created() {
		  //按回车键搜索
		  var that = this;
		  document.onkeydown = function(e) {
		    var ev = document.all ? window.event : e;
		    if (ev.keyCode == 13) {
		      that.getlist();
		    }
		  };

			var user = JSON.parse(localStorage.getItem('USER'));
			this.user_func = user.functions
			for (var i in this.user_func) {
				if (this.user_func[i] != null) {
					var func_number = this.user_func[i].code
				}
				if (func_number.indexOf("B02") >= 0) {
					this.func_B02 = true
				}
			}

			var that = this
			//传进来的shopid
			if (this.$route.query.id) {
				this.shopid = this.$route.query.id
			}
			this.getlistk()
			this.getlist();
			//获取我的secret
			axios.get('/api/plan-market/shop/secret')
				.then(response => {
					this.msg = response.data.data
				})

			//获取自己的id
			var user = JSON.parse(localStorage.getItem('USER'));
			this.id = user.id
			axios.get('/api/plan-market/user/shop')
				.then(response => {
					if (response.data.msg.code == 0) {
						this.shop_id = response.data.data.shop_id
					} else {
						if (response.data.msg.code == 50401) {
							that.$router.push({
								path: "/login"
							});
							return false
						}
						that.$message.error(response.data.msg.info);
					}
				})
		},
		methods: {
      pingbi:function(item,ji){
        this.pingbiji = ji
        this.pingbiwho = item.child_shop_id
        this.log = true


        clearInterval(this.daojishi)
        this.num = 5
        this.daojishi = setInterval(()=>{
          if(this.num > 0){
            this.num--
          }
        },1000)
      },
      change_is_delivery: function() {
        axios.post('/api/plan-market/partner/shield/agent', {
            child_shop_id: this.pingbiwho,
            is_shield_agent: this.pingbiji,
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              this.$message.success('操作成功');
              this.getlist()
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
          this.log = false
      },
			//只显示我分销商品的分销商
			onlyseeme() {
				if (this.checked) {
					this.selling = 1
				} else {
					this.selling = 0
				}
				this.getlist()
			},
			//修改备注名
			fix1: function(id) {
				this.$prompt('请输入备注名', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
				}).then(({
					value
				}) => {
					let that = this
					axios.post('/api/plan-market/partner/setpartner', {
							id: id,
							nick_name: value
						})
						.then(response => {
							if (response.data.msg.code == 0) {
								that.getlist();
							} else {
								that.$message.error(response.data.msg.info);
							}
						})
				})
			},
			//修改mobile
			fix3: function(id) {
				this.$prompt('请输入联系电话', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
				}).then(({
					value
				}) => {
					let that = this
					axios.post('/api/plan-market/partner/setpartner', {
							id: id,
							mobile: value
						})
						.then(response => {
							if (response.data.msg.code == 0) {
								that.getlist();
							} else {
								that.$message.error(response.data.msg.info);
							}
						})
				})
			},
			//修改partner
			fix4: function(id) {
				this.$prompt('请输入负责人', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
				}).then(({
					value
				}) => {
					let that = this
					axios.post('/api/plan-market/partner/setpartner', {
							id: id,
							partner: value
						})
						.then(response => {
							if (response.data.msg.code == 0) {
								that.getlist();
							} else {
								that.$message.error(response.data.msg.info);
							}
						})
				})
			},
			//修改company
			fix5: function(id) {
				this.$prompt('请输入公司名', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
				}).then(({
					value
				}) => {
					let that = this
					axios.post('/api/plan-market/partner/setpartner', {
							id: id,
							company: value
						})
						.then(response => {
							if (response.data.msg.code == 0) {
								that.getlist();
							} else {
								that.$message.error(response.data.msg.info);
							}
						})
				})
			},
			fix2b: function(id) {
				this.jlid = id
				this.dialog = true
			},
			fix2: function() {
				var that = this
				axios.post('/api/plan-market/partner/setpartner', {
						cm_id: this.radio,
						id: this.jlid
					})
					.then(response => {
						if (response.data.msg.code == 0) {
							that.dialog = false
							that.loading = true
							that.getlist()
						} else {
							if (response.data.msg.code == 50401) {
								that.$router.push({
									path: "/login"
								});
								return false
							}
							that.$message.error(response.data.msg.info);
						}
					})
			},
			updateCode() {
				let that = this
        this.$confirm('确认变更该代码么？更改代码后用户将不能通过之前的编码添加您，不影响已有的分销商', '提示', {
        	confirmButtonText: '确认',
        	cancelButtonText: '取消',
        	dangerouslyUseHTMLString: true
        }).then(() => {
          axios.post('/api/plan-market/shop/secret/change')
            .then(response => {
              if (response.data.msg.code == 0) {
                axios.get('/api/plan-market/shop/secret')
                  .then(response => {
                    that.msg = response.data.data
                  })
              } else {
                that.$message.error(response.data.msg.info);
              }
            })
        })

			},
			soldout(id) {
				this.$confirm('是否继续删除?<div>【有情提醒】：为了您的安全，建议定期更换分销商代码</div>', '提示', {
					confirmButtonText: '继续删除',
					cancelButtonText: '我再想想',
					dangerouslyUseHTMLString: true
				}).then(() => {
					var that = this;
					var formData = new FormData();
					formData.append("child_shop_id", id);
					axios.post('/api/plan-market/partner/delete', formData)
						.then(response => {
							if (response.data.msg.code == 0) {
								this.$message.success('删除成功')
								this.getlist()
							} else {
								if (response.data.msg.code == 50401) {
									that.$router.push({
										path: "/login"
									});
									return false
								}
								that.$message.error(response.data.msg.info);
							}
						})
				}).catch(() => {
					// this.$message({
					//   type: 'info',
					//   message: '已取消操作'
					// });
				});
			},
			//全选的ids集合
			ids: function() {
				var checkids = [];
				for (var i in this.list) {
					checkids.push(this.list[i].child_shop_id);
				}
				this.quanxuans = checkids;
			},
			//点击全选
			quanxuan: function() {
				if (
					this.danxuans.length != this.quanxuans.length ||
					this.danxuans.length == 0
				) {
					this.danxuans = this.quanxuans;
					this.quanxuana = true;
				} else {
					this.danxuans = [];
					this.quanxuana = false;
				}
			},
			//点击单选
			danxuan: function() {
				// this.choosearea.push(this.checkedarea)
				if (this.danxuans.length == this.quanxuans.length) {
					this.quanxuana = true;
				} else {
					this.quanxuana = false;
				}
			},
			//翻页
			fanye: function(page) {
				this.loading = true
				this.page = page
				this.getlist()
			},
			//跳转编辑佣金
			fixmoney: function(id) {
				this.$router.push({
					path: '/editMoney',
					query: {
						id: id
					}
				})
			},
			//跳转查看订单
			seeorder: function(id) {
				this.$router.push({
					path: '/order_question/orderOther',
					query: {
						id: id
					}
				})
			},
			seeshop: function(id) {
				this.$router.push({
					path: '/myDistributor/myDistributorshop',
					query: {
						id: id
					}
				})
			},
			//获取分销商
			getlist: function() {
				this.danxuans = [];
				this.quanxuana = false
				this.search = this.search.trim()
				var that = this;
				axios.get('/api/plan-market/partner/list?name=' + encodeURIComponent(this.search) + '&page=' + this
						.page + '&page_size=' + this.pagesize + '&selling=' + this.selling + '&is_shield_agent='+this.is_shield_agent)
					.then(response => {
						if (response.data.msg.code == 0) {
							that.list = response.data.data.data
							that.total = response.data.data.total
							that.ids()
							that.loading = false
						} else {
							if (response.data.msg.code == 50401) {
								that.$router.push({
									path: "/login"
								});
								return false
							}
							that.$message.error(response.data.msg.info);
						}
					})
			},
			setk: function() {
				var that = this
				axios.post('/api/plan-market/cm/add', {
						cm_id: this.radio,
						child_shop_ids: this.danxuans
					})
					.then(response => {
						if (response.data.msg.code == 0) {
							that.dialog = false
							that.loading = true
							that.getlist()
						} else {
							if (response.data.msg.code == 50401) {
								that.$router.push({
									path: "/login"
								});
								return false
							}
							that.$message.error(response.data.msg.info);
						}
					})
			},
			//获取人员
			getlistk: function() {
				var that = this
				axios.get('/api/plan-market/user/list?page=1&page_size=10000&status=0')
					.then(response => {
						if (response.data.msg.code == 0) {
							that.listk = response.data.data.data
						} else {
							if (response.data.msg.code == 50401) {
								that.$router.push({
									path: "/login"
								});
								return false
							}
							that.$message.error(response.data.msg.info);
						}
					})
			},
			//复制
			copy: function() {
        var that = this
				const input = document.createElement('input');
				document.body.appendChild(input);
				input.setAttribute('value', window.location.origin + window.location.pathname+'#/register?supplier_id=' + this.msg);
				input.select();
				if (document.execCommand('copy')) {
					document.execCommand('copy');
					that.$message({
						message: '复制成功',
						type: 'success'
					});
				}
				document.body.removeChild(input);

			},
			//搜索
			searchgo: function() {
				this.page = 1
				this.loading = true
				this.getlist()
			},
			loggo: function() {

			},
			allcopy: function(text) {

				var t = text

				var that = this;


				this.$copyText(t).then(res => {
					that.$message.success("复制成功");
				});
			},
		}

	}
</script>
<style scoped>
	.t_nav_tab_box{
		display: flex;
		background-color: #F9F9F9;

	}
	.t_tab_nav{
		width: 176px;
		line-height: 50px;
		text-align: center;
		color: #333333;
	}
	.t_tab_nav_lei{
		background-color: white;
		border-bottom: 3px solid #F1F8FF;
	}
	.t_newtitle_box{
		display: flex;
		align-items: center;

	}
	.t_red_line{
		width: 4px;
		height: 16px;
		background-color: #F1F8FF;
		margin-right: 7px;
	}
	.t_new_title{
		color: #333333;
	}
	.t_title_tips{
		color: #878787;
		font-size: 14px;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	.t_red_tips{
		color: #E74A90;
		font-size: 14px;
		margin-top: 20px;
	}
	.t_myid{
		background-color: #F6F9FC;
		padding: 30px 20px;
		width: 650px;
	}
	.t_invitation{
		background-color: #F6F9FC;
		padding: 30px 20px;
		text-align: center;
		width: 650px;
	}
</style>
<style lang="scss" scoped>
	.index {

    /deep/ .el-select{width: 250px; margin-right: 20px;}
    /deep/ .el-input{width: 250px; margin-right: 20px;}
    /deep/ .el-input__inner{ line-height: 36px; height: 36px; font-size: 12px; background: rgb(247, 248, 250); border: 0;}
    /deep/ .el-range-editor .el-range-input { background: #f7f8fa;}
    // /deep/ .el-button{ padding: 11px 23px !important;}

    /deep/ .el-input__inner:-moz-placeholder {
        color: rgb(140, 140, 140);
    }

    /deep/ .el-input__inner:-ms-input-placeholder {
        color: rgb(140, 140, 140);
    }

    /deep/ .el-input__inner::-webkit-input-placeholder {
        color: rgb(140, 140, 140);
    }
    /deep/ .el-button--danger {
        color: #FFF;
        background-color: #2974FF;
        border-color: #2974FF;
    }
    /deep/ .el-button--danger.is-plain {
        color: #18A0FB !important;
        background: #EEF7FF !important;
        border-color: #18A0FB !important;
    }

				.title {
					border-bottom: 1px #EAEAEA solid;
					line-height: 45px;
					padding-left: 30px;
					font-size: 16px;
					background: #F9F9F9;
					color: #727272;
				}

				.add {
					display: flex;
					justify-content: space-between;
					padding: 20px 30px;
					text-align: right;
					position: relative;

					.input-with-select {
						width: 280px;
					}

					.el-button {
						padding: 10px 20px;
					}
				}

				.list {
					display: flex;
					text-align: center;
					color: #727272;
					line-height: 45px;
					margin: 0 20px;
					border: 1px #EAEAEA solid;
					margin-top: -1px;

					.th {
						flex: 1;
						background: #F9F9F9;
						font-size: 14px;
						border-right: 1px #EAEAEA solid;
					}

					.td {
						flex: 1;
						font-size: 14px;
						border-right: 1px #EAEAEA solid;

						.el-button {
							a {
								color: #409EFF;
							}

							&:hover {
								a {
									color: #FFF;
								}
							}
						}

					}

					.th1 {
						flex-basis: 50px;
						background: #F9F9F9;
						font-size: 14px;
						border-right: 1px #EAEAEA solid;
					}

					.td1 {
						flex-basis: 50px;
						font-size: 14px;
						border-right: 1px #EAEAEA solid;
					}

				}

				.el-pagination {
					text-align: right;
					margin: 20px 0
				}

				.my {
					display: flex;
					justify-content: space-between;
					padding: 20px;
					line-height: 20px;
					align-items: center;

					.myid {
						font-size: 17px;
						color: #DD2727;
						padding-left: 10px;
						display: flex;
						align-items: center;

						.tip {
							display: inline-flex;
							flex-direction: column;

							span {
								color: #B1B1B1;
								font-size: 14px;
								margin: 0 20px
							}
						}
					}

					.invitation {
						font-size: 14px;
						color: #B1B1B1;

						span {
							color: #197CFF;
							cursor: pointer;
						}
					}
				}


	}
</style>
